<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>成易博客-博客</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="../static/css/cinui.css"/>
    <link rel="stylesheet" href="../static/layui-v2.6.8/layui/css/layui.css" media="all">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <script src="../static/layui-v2.6.8/layui/layui.js" charset="utf-8"></script>
    <script src="../static/js/jquery-3.6.js"></script>
    <!--  图标库  -->
    <link href="../static/font-awesome-4.7.0/css/font-awesome.min.css" rel="stylesheet">
    <!--  富文本  -->
    <script src="https://cdn.jsdelivr.net/npm/wangeditor@latest/dist/wangEditor.min.js"></script>
    <script src="../static/js/public.js" type="module"></script>
</head>
<body>
<center>
    <ul class="layui-nav layui-col-lg12 layui-col-md12 layui-col-sm12 layui-col-xs12">
        <li class="layui-nav-item">
            <a href="home.html">首页</a>
        </li>
        <li class="layui-nav-item">
            <a href="sign_in.html">打卡</a>
        </li>
        <li class="layui-nav-item">
            <a href="blog.html">博客</a>
        </li>
        <li class="layui-nav-item">
            <a href="shop.html">商城</a>
        </li>
        <li class="layui-nav-item">
            <a href="grade_system.html">等级体系</a>
        </li>
        <li class="layui-nav-item"  id="vueDemo">
            <a href="javaScript:;"><i class="fa fa-user-circle-o">&nbsp;&nbsp;<span id="userName">&nbsp;&nbsp;</span></i></a>
            <dl class="layui-nav-child">
                <dd class=""><a :href="url">个人中心</a></dd>
                <dd class=""><a href="javascript:;">修改信息</a></dd>
                <dd class=""><a href="javascript:;"></a></dd>
                <dd class=""><a href="removeSession" id="logout">退出</a></dd>
            </dl>
        </li>
    </ul>
</center>
<div class="layui-col-lg4 layui-col-md4 layui-col-sm10 layui-col-xs10 layui-col-md-offset4 layui-col-sm-offset1 layui-col-xs-offset1 formClass"
     style="margin-top: 4%;margin-bottom: 2%;background: white">
    <form class="layui-form layui-col-lg12 layui-col-md12 layui-col-sm12 layui-col-xs12" action="addBlog" method="post"
          name="form1" style="padding: 12%;">
        <div class="layui-form-item layui-col-lg12  layui-col-md12 layui-col-sm12 layui-col-xs12">
            <label class="layui-form-label">博客标题</label>
            <div class="layui-input-block">
                <input type="text" id="blogTitle" name="blogTitle" required lay-verify="required" placeholder="博客标题"
                       autocomplete="off" class="layui-input layui-col-lg12  layui-col-md12 layui-col-sm12 layui-col-xs12"
                       onblur="a()">
            </div>
<!--            <div class="layui-form-mid layui-word-aux" id="info1"></div>-->
        </div>
        <div class="layui-form-item layui-col-lg12 layui-col-md12 layui-col-sm12 layui-col-xs12">
            <label class="layui-form-label">博客标签</label>
            <div class="layui-input-block">
                <input type="text" id="blogMemo" name="blogMemo" required lay-verify="required" placeholder="博客标签"
                       autocomplete="off" class="layui-input layui-col-lg12  layui-col-md12 layui-col-sm12 layui-col-xs12">
            </div>
<!--            <div class="layui-form-mid layui-word-aux"></div>-->
        </div>


        <div class="layui-form-item layui-col-lg12 layui-col-md12 layui-col-sm12 layui-col-xs12">
            <label class="layui-form-label">博客状态</label>
            <div class="layui-input-block">
                <input type="radio" name="blogStatus" value="公开" title="公开" checked>
                <input type="radio" name="blogStatus" value="私密" title="私密">
            </div>
        </div>
        <div class="layui-form-item layui-form-text  layui-col-lg12 layui-col-md12 layui-col-sm12 layui-col-xs12">
            <label class="layui-form-label">博客内容</label>
            <div class="layui-input-block">
<!--       富文本  暂停使用         -->
<!--                <div id="div1"></div>-->
<!--                <div id="text-container" class="text"></div>-->
<!--                <textarea id="blogValue" name="blogValue" placeholder="博客内容"-->
<!--                          class="layui-textarea layui-col-lg12  layui-col-md12 layui-col-sm12 layui-col-xs12" style="display: none"></textarea>-->
                <textarea id="blogValue" name="blogValue"
                          class="layui-textarea layui-col-lg12  layui-col-md12 layui-col-sm12 layui-col-xs12"></textarea>
            </div>
        </div>
        <div class="layui-form-item  layui-col-lg12 layui-col-md12 layui-col-sm12 layui-col-xs12">
            <div class="layui-input-block">
                <button class="layui-btn layui-btn-normal" id="submit" lay-submit lay-filter="formDemo">发布
                </button>
            </div>
        </div>
    </form>
</div>

<div>
    <ins class="adsbygoogle" style="display:inline-block;width:100%;"></ins>
</div>


<table class="layui-table layui-col-lg12 layui-col-md12 layui-col-sm12 layui-col-xs12"
       lay-data="{ url:'queryBlogList',cellMinWidth: 100, id:'idTest'}" lay-filter="demo">
    <thead>
    <tr>
        <th lay-data="{field:'userName'}">作者</th>
        <th lay-data="{field:'blogTitle'}">标题</th>
        <th lay-data="{field:'blogDate', sort: true}">创建时间</th>
        <th lay-data="{field:'blogMemo'}">签名</th>
        <th lay-data="{field:'blogValue'}">内容</th>

        <th lay-data="{field:'blogStatus'}">状态</th>
        <th lay-data="{field:'pageViews', sort: true}">浏览量</th>
        <th lay-data="{fixed: 'right', width:120, align:'center', toolbar: '#barDemo'}">操作</th>
    </tr>
    </thead>
</table>

<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>


<script type="text/javascript" src="../static/js/userInfo.js"></script>

<!--富文本 暂停使用-->
<!-- 引入 wangEditor.min.js -->
<!--<script type="text/javascript">-->
<!--    const E = window.wangEditor-->
<!--    const editor = new E('#div1','#text-container')-->
<!--    const $text1 = $('#blogValue')-->
<!--    editor.config.onchange = function (html) {-->
<!--        // 第二步，监控变化，同步更新到 textarea-->
<!--        $text1.val(html)-->
<!--    }-->

<!--    // 配置菜单栏，删减菜单，调整顺序-->
<!--    editor.config.menus = [-->
<!--        'bold',-->
<!--        'head',-->
<!--        'fontName',-->
<!--        'justify',-->
<!--        'link',-->
<!--        'italic',-->
<!--        'underline'-->
<!--    ]-->

<!--    editor.create()-->

<!--    // 第一步，初始化 textarea 的值-->
<!--    $text1.val(editor.txt.html())-->
<!--</script>-->
<script src="../static/tinymce/js/tinymce/tinymce.min.js"></script>
<script>
    tinymce.init({
        selector: '#blogValue',
        toolbar: false,
        toolbar: "preview fullscreen",
        language:'zh_CN',//注意大小写
        plugins: "insertdatetime toc preview",
        insertdatetime_formats: ["%H点%M分", "%Y年%m月%d日"],
    });
</script>

<script>

    layui.use('table', function () {

        var table = layui.table;
        //监听工具条
        table.on('tool(demo)', function (obj) {
            var data = obj.data;
            if (obj.event === 'del') {
                layer.confirm('真的删除行么', function (index) {
                    layer.close(index);
                    //**执行删除操作**
                    $.post("deleteBlog", {"blogId": data.blogId}, function () {
                        layer.alert('删除成功');
                        location.reload();//页面刷新数据
                    })
                });
            } else if (obj.event === 'edit') {
                layer.open({
                    id: 'alertInfo',
                    title: '信息修改',
                    skin: ' layui-col-lg6 layui-col-md10 layui-col-sm10 layui-col-xs10',//样式类名
                    type: 2,//iframe层
                    shade: [0.8, 'rgba(130,125,125,0.54)'],
                    anim: 5,
                    closeBtn: 1,
                    maxmin: true,
                    offset: 'auto',
                    content: 'blogUpdate.html',//打开一个弹出窗体
                    zIndex: layer.zIndex, //重点1
                    success: function (layero) {
                        layer.setTop(layero); //重点2
                    },
                    cancel: function(index, layero){
                        location.reload();
                    }
                });
            }

            var sessionBlogId = sessionStorage.setItem('blogId', data.blogId)
            var sessionUserName = sessionStorage.setItem('userName', data.userName)
            var sessionBlogTitle = sessionStorage.setItem('blogTitle', data.blogTitle)
            var sessionBlogStatus = sessionStorage.setItem('blogStatus', data.blogStatus)
            var sessionBlogMemo = sessionStorage.setItem('blogMemo', data.blogMemo)
            var sessionBlogValue = sessionStorage.setItem('blogValue', data.blogValue)

        });
    });
</script>

<script>
    layui.use('form', function () {
        var form = layui.form;
        //监听提交  获取表单json数据

        form.on('submit(formDemo)', function (data) {
            layer.alert('发布成功',{ icon : 6});
            return true;
        });
    });
</script>
</body>
</html>